<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <style>
        body{
            text-align: center;
        }
        canvas{
            border: 1px solid #000;
        }
    </style>
</head>
<body>
<canvas width="600" height="600"></canvas>
<script>
    var cas=document.querySelector("canvas");
    var ctx=cas.getContext("2d");

    //填充整个canvas
    ctx.fillRect(0,0,cas.width,cas.height);
    //擦除
    ctx.clearRect(50,50,50,50)


</script>
</body>
</html>